<template>
  <div class="full-box shadow-box padding-box">
    <div class="operate-bar">
      <div class="btn-group">
        <el-button type="info" @click="goBack">返回</el-button>
      </div>
    </div>
    <el-collapse v-if="info" v-model="activeNames" :accordion="false">
      <el-collapse-item title="检查整改单详情" :name="1">
        <div class="desc">
          <label>整改单编号：</label>
          <span>{{ info.mend_code }}</span>
        </div>
        <div class="desc">
          <label>整改项目：</label>
          <span>{{ info.object_name }}</span>
        </div>
        <div class="desc">
          <label>问题来源：</label>
          <span>{{ questionSource(info.problem_source) }}</span>
        </div>
        <div class="desc">
          <label>问题类型：</label>
          <span>
            <span class="question-type">
              {{ info.problem_type_safety == 1 ? "工程安全" : "" }}
            </span>
            <span class="question-type">
              {{ info.problem_type_quality == 1 ? "工程质量" : "" }}
            </span>
            <span class="question-type">
              {{ info.problem_type_build == 1 ? "文明施工" : "" }}
            </span>
            <span class="question-type">
              {{ info.problem_type_duty == 1 ? "人员到岗" : "" }}
            </span>
          </span>
        </div>
        <div class="desc">
          <label>疑似事项：</label>
          <span v-if="info.recontract == 1">非法转包</span>
          <span
            style="margin: 0 -20px"
            v-if="info.recontract == 1 && info.subcontract == 1"
          >
            |
          </span>
          <span v-if="info.subcontract == 1">违法分包</span>
        </div>
        <div class="desc">
          <label>问题描述：</label>
          <span>{{ info.problem_desc }}</span>
        </div>
        <div class="desc">
          <label>相同问题重复次数：</label>
          <span>{{ info.repeat_count }}</span>
        </div>
        <div class="desc">
          <label>检查单位：</label>
          <span>{{ info.inspect_unit }}</span>
        </div>
        <div class="desc">
          <label>检查人员：</label>
          <span>{{ info.inspector }}</span>
        </div>
        <div class="desc">
          <label>整改要求：</label>
          <span>{{ info.mend_require }}</span>
        </div>
        <div class="desc">
          <label>反馈日期要求：</label>
          <span>{{ info.feedback_date_require }}</span>
        </div>
        <div class="desc">
          <label>完成日期要求：</label>
          <span>{{ info.finish_date_require }}</span>
        </div>
        <div class="desc">
          <label>登记时间：</label>
          <span>{{ info.regist_date }}</span>
        </div>
        <div class="desc">
          <label>状态：</label>
          <span>{{ info.status_text }}</span>
        </div>
      </el-collapse-item>
      <el-collapse-item
        v-if="info.mendList && info.mendList.length > 0"
        title="反馈单"
        :name="2"
      >
        <el-tabs v-model="active" type="border-card" tab-position="top">
          <el-tab-pane
            v-for="(item, index) in info.mendList"
            :key="index"
            :label="`第 ${info.mendList.length - index} 次反馈`"
            :name="item.id"
          >
            <div class="desc">
              <label>反馈信息：</label>
              <span>{{ item.feedback_content }}</span>
            </div>
            <div class="desc">
              <label>反馈时间：</label>
              <span>{{ item.feedback_date }}</span>
            </div>
            <el-divider
              direction="horizontal"
              content-position="left"
            ></el-divider>
            <template v-if="item.check_status != ''">
              <div class="desc">
                <label>评价结果：</label>
                <span>{{ item.check_status_text }}</span>
              </div>
              <div class="desc">
                <label>评价信息：</label>
                <span>{{ item.check_content }}</span>
              </div>
              <div class="desc">
                <label>审核意见：</label>
                <span>{{ item.check_content }}</span>
              </div>
              <div class="desc">
                <label>评价时间：</label>
                <span>{{ item.check_time }}</span>
              </div>
            </template>
            <template v-else>
              <el-form
                :model="form"
                ref="form"
                :rules="rules"
                label-width="80px"
                :inline="false"
              >
                <el-form-item label="审核结果" prop="check_status">
                  <el-select
                    style="width: 150px"
                    v-model="form.check_status"
                    value-key=""
                    placeholder=""
                    clearable
                  >
                    <el-option :key="100" label="通过" :value="100"></el-option>
                    <el-option :key="0" label="不通过" :value="0"></el-option>
                  </el-select>
                </el-form-item>
                <el-form-item
                  v-if="form.check_status == 100"
                  label="评价等级"
                  prop="appraise_grade"
                >
                  <el-select
                    style="width: 150px"
                    v-model="form.appraise_grade"
                    value-key=""
                    placeholder=""
                  >
                    <el-option :key="0" label="满意" value="满意"></el-option>
                    <el-option :key="1" label="一般" value="一般"></el-option>
                    <el-option :key="2" label="较差" value="较差"></el-option>
                  </el-select>
                </el-form-item>

                <el-form-item label="评价内容" prop="check_content">
                  <el-input
                    type="textarea"
                    v-model="form.check_content"
                    placeholder="请对反馈内容进行回复"
                    :autosize="{ minRows: 3, maxRows: 6 }"
                  ></el-input>
                </el-form-item>
                <el-form-item label="">
                  <el-button type="primary" @click="save">评价</el-button>
                </el-form-item>
              </el-form>
            </template>
          </el-tab-pane>
        </el-tabs>
      </el-collapse-item>
    </el-collapse>
  </div>
</template>

<script>
import {
  addCheckAndRectifyEvaluation,
  getCheckAndRectifyDetails,
} from "@/api/CheckAndRectify/Index";
import { required } from "@/utils/eValidate";
import { questionSource } from "@/utils/typeHelper";
export default {
  name: "CheckAndRectifyEvaluationDetails",
  data() {
    return {
      id: 0,
      active: "",
      activeNames: [1],
      info: null,
      form: {
        // 评价状态 0 不满意 100 满意
        check_status: "",
        check_content: "",
      },
      rules: {
        check_status: [required],
        check_content: [required],
        appraise_grade: [required],
      },
    };
  },
  methods: {
    questionSource,
    initData() {
      getCheckAndRectifyDetails({ id: this.id }).then((res) => {
        this.info = res.data;
        if (this.info.mendList && this.info.mendList.length > 0) {
          this.activeNames = [1, 2];
          this.active = this.info.mendList[0].id;
        }
      });
    },
    goBack() {
      this.$router.push("/checkAndRectifyEvaluation");
    },
    save() {
      this.$refs.form[0].validate().then((valid) => {
        this.form.id = this.active;
        this.form.check_mend_id = this.id;
        addCheckAndRectifyEvaluation(this.form).then((res) => {
          if (res.code == 0) {
            this.$message.success("评价成功");
            this.initData();
          }
        });
      });
    },
  },
  created() {
    this.id = this.$route.params.id;
    if (this.id > 0) {
      this.initData();
    }
  },
};
</script>

<style lang="scss" scoped></style>
